<template>
	<view class="payment-cancellation-layout">
		<view class="payment-cancellation-header">
			<text>分期扣款</text>
			<text>(当月设置，下个月生效为第一个还款日)</text>
		</view>
		<view class="payment-cancellation-item">
			<text>当前货款总额</text>
			<text>¥{{formParams.totalMoney}}</text>
			<view class="line"></view>
		</view>
		<view class="payment-cancellation-item">
			<text>核销金额</text>
			<xh-input placeholder="请输入" inputTextAlign="right" :isLine="false" padding="0" height="40rpx" v-model="formParams.money"></xh-input>
		</view>
		<view class="submit-btn" style="margin-top: 100rpx;" @tap="submit">确认</view>
	</view>
</template>

<script setup>
	import { onLoad } from '@dcloudio/uni-app'
	import { ref } from 'vue'
	import { verifyingPaymentBill,getGoodsBillAmount } from '@/common/api/api.js'
	const props = defineProps(['agentId'])
	const formParams = ref({
		totalMoney:0,
		money:''
	})
	// 获取当前货款总额
	const getGoodsBillAmountData = async ()=>{
		const res = await getGoodsBillAmount({agentId:props.agentId})
		formParams.value.totalMoney = res.result.billUnpayAmount
	}
	// 确认
	const submit = async () => {
		if(uni.$uv.test.empty(formParams.value.money)){
			uni.$utils.showToast('请输入核销金额')
			return
		}
		let params = {}
		params.agentId = props.agentId
		params.verifyingAmount = uni.$uv.trim(formParams.value.money,'all')
		await verifyingPaymentBill(params)
		uni.$utils.showToast('核销成功')
		uni.navigateBack()
	}
	onLoad(()=>{
		getGoodsBillAmountData()
	})
</script>

<style lang="scss" scoped>
	.payment-cancellation-layout {
		.payment-cancellation-header {
			display: flex;
			align-items: center;
			padding: 30rpx;
			color: $xh-color-9;
			font-size: 24rpx;

			text:nth-child(2) {
				color: $xh-orange-color;
			}
		}

		.payment-cancellation-item {
			display: flex;
			align-items: center;
			justify-content: space-between;
			padding: 30rpx;
			background-color: #fff;
			position: relative;

		}
	}
</style>